<?php
 include("./set.php");
 ?>
	     <div class="container-fluid">
	         <div class="row">
	             <div class="col-lg-12">
	                 <div class="card">
	                     
                         <div class="row">
  <div class="col-lg-12">
    <div class="card">
      <div class="card-body">
        <div class="alert alert-info" role="alert">通知请在这里查收</div>


        <div class="teachers-list">
     
        </div>

      </div>
    </div>
  </div>
</div>


<style>
  .teachers-list {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
  }
  .teacher-card {
    border: 1px solid #dee2e6;
    border-radius: 5px;
    padding: 15px;
    width: calc(33.333% - 20px);
  }
  .teacher-header {
    border-bottom: 1px solid #dee2e6;
    padding-bottom: 10px;
    margin-bottom: 10px;
  }
  .teacher-footer {
    text-align: right;
    margin-top: 10px;
  }
</style>
<script>
    const searchParams = new URLSearchParams(window.location.search);
    let abids = searchParams.get('type');
    var userid = searchParams.get('userid');
fetch('./msg/get.php?userid='+userid+'&type='+abids)
.then(res=>res.json())
.then(data=>{
    if(data.status !== 200){
        layer.msg('获取数据失败');
        return;
    }
    layer.msg('加载成功');
    var sjteach = data.msg;
    for(let i=0;i<sjteach.length;i++) {
        let card = document.createElement("div");
        card.className="teacher-card";
        card.innerHTML = `
        <div class="teacher-header">
        <h5>${sjteach[i]['title']}</h5>
        <small>${sjteach[i]['time']}</small>
        </div>
        <div class="teacher-body">
        <p>${sjteach[i]['content']}</p>
        </div>`;
        if(sjteach[i]['content'].length > 100) {
            card.querySelector(".teacher-body p").innerText = sjteach[i]['content'].substring(0,100)+'...';
        }
        let button  = document.createElement('button');
        button.innerHTML = "查看";
        button.className = "btn btn-primary";
        button.onclick = function(){
            layer.alert(sjteach[i]['content']);
        }
        card.appendChild(button);
        document.querySelector(".teachers-list").appendChild(card);
    }    
})

</script>